<script setup lang="ts" name="App">
// 模板里面就能用了
import Person from './components/Person.vue';
import { reactive } from 'vue';
import { PersonList } from '@/types';
let personList = reactive<PersonList>([
  { id: '1', name: '张三', age: 18 },
  { id: '2', name: '李四', age: 18, x: true },
  { id: '3', name: '张三', age: 18 },
]);
</script>

<template>
  <!-- <Person ref="ren" /> -->
  <Person :list="personList" a="哈哈" ref="ren" />
</template>

<style scoped>
.logo {
  height: 6em;
  padding: 1.5em;
  will-change: filter;
  transition: filter 300ms;
}
.logo:hover {
  filter: drop-shadow(0 0 2em #646cffaa);
}
.logo.vue:hover {
  filter: drop-shadow(0 0 2em #42b883aa);
}
</style>
